<template>
	<div>
		<ul class="aui-list aui-form-list aui-margin-b-15">
			<li class="aui-list-item">
				<div class="aui-list-item-inner">
					<div class="aui-list-item-label">姓名 </div>
					<div class="aui-list-item-input">				<!--receivername-->
						<input type="text" placeholder="输入收货人姓名" v-model="receivername" id="addressUserName" maxlength="10">
					</div>
				</div>
			</li>
			<li class="aui-list-item">
				<div class="aui-list-item-inner" ref="iosTouch" @click="iosTouchClickEvent" @touchstart="iosTouchTouchstartEvent">
					<div class="aui-list-item-label">性别</div>
					<div class="aui-list-item-input addressText" id="Sex">
						<label><input class="aui-radio" type="radio" name="demo1" :checked="sex=='男'" @click.stop="getSex(0)"><span class="labelMargin">先生</span></label> &nbsp;&nbsp;
						<label><input class="aui-radio" type="radio" name="demo1" :checked="sex=='女'" @click.stop="getSex(1)"><span class="labelMargin">女士</span></label>
					</div>
				</div>
			</li>
			<li class="aui-list-item">
				<div class="aui-list-item-inner">
					<div class="aui-list-item-label">手机号码</div>
					<div class="aui-list-item-input">
						<input type="text" placeholder="输入收货人手机号码" v-model="phone" id="addressMobile">
					</div>
					<!--<div style="width: 10%;">
						
					</div>-->
				</div>
			</li>
		</ul>
	</div>
</template>

<script>
	import {mapMutations} from 'vuex';
	export default {
		props:{
			addFlag: {
				type: Boolean,
                default:true
			},
			getUserInfo: {
				type: Object,
				default: {}
			},
			getNowAddress: {
				type: Object,
				default: {}
			}
//			item: {
//              type: Object,
//              default:()=>{
//              	return {}
//              }
//          },
//          userInfomation: {
//          	type: Object,
//              default: ()=>{
//              	return {}
//              }
//          },
//          getstatusBtn: {
//          	type: Function,
//              default: () => {}
//          }
		},
		data() {
			return {
				receivername:null,
				sex:null,
				phone:null
			}
		},
		methods:{
			...mapMutations('zx',[
				"setNowAddressMutationSinger"
			]),
			iosTouchClickEvent(){
				console.log('iosTouchClickEvent');
			},
			iosTouchTouchstartEvent(){
				console.log('iosTouchTouchstartEvent');
			},
			getSex(type){
				if(type == 0){
					this.sex = '男';
				}else {
					this.sex = '女';
				}
			},
			keyCodeEvent(event){
				var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios
				if (!isiOS) {
					
					return ;
				}
				if (event.keyCode === 13) {
//					console.log(this.$refs.iosTouch);
//					console.log(this.$refs.iosTouch.touchstart);
//					return;
//					this.$refs.iosTouch.touchstart();
					this.$refs.iosTouch.click();
				}
			},
			addKeyCodeEventListener() {
				window.addEventListener("keyup", this.keyCodeEvent.bind(this), false);
			},
			removeKeyCodeEventListener() {
				window.removeEventListener("keyup", this.keyCodeEvent.bind(this), false);
			}
		},
		watch:{
			receivername(nvalue,ovalue){
				let nowAddressSinger = {};
				nowAddressSinger.receivername = nvalue;
				this.setNowAddressMutationSinger(nowAddressSinger);
//				console.log('receivername',nvalue,ovalue);
			},
			sex(nvalue,ovalue){
				let nowAddressSinger = {};
				if(nvalue == '男'){
					nowAddressSinger.sex = '0';
				}else if(nvalue == '女'){
					nowAddressSinger.sex = '1';
				}
				this.setNowAddressMutationSinger(nowAddressSinger);
//				console.log('sex',nvalue,ovalue);
			},
			phone(nvalue,ovalue){
				let nowAddressSinger = {};
				nowAddressSinger.phone = nvalue;
				this.setNowAddressMutationSinger(nowAddressSinger);
//				console.log('phone',nvalue,ovalue)
			}
		},
		created(){
//			this.addKeyCodeEventListener();
			if(!this.addFlag){
				this.receivername = this.getNowAddress.receivername;
				this.phone = this.getNowAddress.phone;
				this.sex = this.getNowAddress.sex;
				if(this.sex  == '0'){
					this.sex = '男';
				}else if(this.sex  == '1'){
					this.sex = '女';
				}
			}else if(this.addFlag){
				this.receivername = this.getNowAddress.receivername;
				this.phone = this.getNowAddress.phone;
				this.sex = this.getNowAddress.sex;
				if(this.sex  == '0'){
					this.sex = '男';
				}else if(this.sex  == '1'){
					this.sex = '女';
				}else{
					this.sex = '男';
				}
				
			}
			
		},
		beforeDestroy() {
//			this.removeKeyCodeEventListener();
		}
	}
</script>

<style scoped="scoped">
	.addressText{
		text-align: left;
	}
	.labelMargin{
		margin-left: 7px;
	}
</style>